<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>同行易</title>
    <style>
        form {
            background-image: url("img/background.jpg");
            background-position: center center;
            background-repeat: no-repeat;
            background-attachment: fixed;
            background-size: cover;
            max-width: 540px;
            height: 960px;
            background-color: rgba(187, 229, 241, 0.5);
            border: 1px solid #d3cbcb;
            margin: auto;
            color: rgb(6, 1, 12);
            border-radius: 6px;
            /* padding: 20px 40px; */
            position: relative;
        }
        #header{
            width:100%;
            height:260px;
        }
        #image{
            float:left;
        }
        #name{
            width:340px;
            height:200px;
            float:left;
            text-align:center;
            line-height:200px;
        }
        #identity{
            width:100%;
            height:50px;
        }
        #identity:hover{
            box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5); 
        }
        #message{
            width:100%;
            height:50px;
        }
        #message:hover{
            box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5); 
        }
        #setting{
            width:100%;
            height:50px;
        }
        #setting:hover{
            box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5); 
        }
        #footer{
            width:100%;
            height:30px;
            position:absolute;
            bottom:0;
        }
        #left{
            width:30%;
            height:30px;
            margin:0 4%;
            padding: 0 20px;
            float:left;
        }
        #center{
            width:30%;
            height:30px;
            margin:0 4%;
            padding: 0 20px;
            float:left;
        }
        #right{
            width:30%;
            height:30px;
            margin:auto;
            padding: 0 20px;
            clear:both;
        }
        #left:hover{
            cursor:pointer;
            background-color: rgb(194, 224, 224);
        }
        #center:hover{
            cursor:pointer;
            background-color: rgb(194, 224, 224);
        }
        #right:hover{
            cursor:pointer;
            background-color: rgb(194, 224, 224);
        }
        a{
            display:block;
        }
    </style>
</head>
<body>
    <form action="" method="">
    <div id="header">
        <div id="image">
            <img src="image\头像(1)(1).jpg" alt="头像">
        </div>
        <div id="name">
            <h2>用户名</h2>
        </div>
    </div>
    <div id="identity">
        <a href="#" style="text-decoration:none">身份认证</a>
    </div>
    <div id="message">
    <a href="#" style="text-decoration:none">消息中心</a>
    </div>
    <div id="setting">
        <a href="#" style="text-decoration:none">设置</a>
    </div>
        <div id="footer" class="">
            <table width="100%" height="100%" align="center">
                <tr>
                    <td id="left"><a href="首页web.html">首页</a></td>
                    <td id="center"><a href="我的行程web.html">我的行程</a></td>
                    <td id="right"><a href="#">个人中心</a></td>
                </tr>
            </table>
        </div>
    </form>
</body>

</html>